﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>CallAndApply2</title>
</head>
<body>
    <script type="text/javascript">
        function baseA()        // base Class A  
        {
            this.member = "baseA member";
            this.showSelfA = function () {
                window.alert(this.member);
            }
        }

        function baseB()        // base Class B  
        {
            this.member = "baseB member";
            this.showSelfB = function () {
                window.alert(this.member);
            }
        }

        function extendAB()     // Inherit Class from A and B  
        {
            baseA.call(this);   // call for A  
            baseB.call(this);   // call for B  
        }

        window.onload = function () {
            var extend = new extendAB();
            extend.showSelfA();     // show A  
            extend.showSelfB();     // show B  
        }
    </script>

    <script type="text/javascript">
        /*
        当调用extend.showSelfA();时，此时的this指向extendAB（并不是我们推测的两次都指向baseB对象）
真实原因是extendAB对象的成员变量member在被baseB.call(this);实例化时，被baseB的成员member覆盖了，即extendAB的成员member由baseA member赋值成了
        */
    </script>
</body>
</html>
